<template>
		<div class="personal-box">
			<div class="personal-center">
				<div class="personal-title">
					<h2>个人中心</h2>
					<span></span>
				</div>
				<div class="personal-main">
					<div class="pub-input">
						<span class="pub-input-title">用户姓名:</span>
						<input type="text" id="username" class="pub-inputbox" v-model="name">
					</div>
					<div class="pub-input">
						<span class="pub-input-title">联系方式:</span>
						<input disabled="" type="text" id="phone" class="pub-inputbox" v-model="phone">
					</div>
					<div class="pub-input">
						<span class="pub-input-title">*房屋面积:</span>
						<select class="pub-select" v-model="fixarea">
							<option v-for="(item, index) in fixareaData" :key="index" :value="item.key">{{item.value}}</option>
						</select>
					</div>
					<div class="pub-input">
						<span class="pub-input-title">装修时间:</span>
						<select class="pub-select" v-model="fixtime">
							<option v-for="(item, index) in fixtimeData" :key="index" :value="item.key">{{item.value}}</option>
						</select>
					</div>
					<div class="pub-input">
						<span class="pub-input-title">装修预算:</span>
						<select class="pub-select" v-model="fixmoney">
							<option v-for="(item, index) in fixmoneyData" :key="index" :value="item.key">{{item.value}}</option>
						</select>
					</div>
<!-- 					<div class="pub-input">
						<span class="pub-input-title">所属地区:</span>
						<div class="city_box" id="city_1">
							<select class="prov"></select> 
							<select class="city"></select>
							<select class="area"></select>
						</div>
					</div> -->
					<span class="personal-btn" @click="submit">修改提交</span>
				</div>
			</div>
		</div>
</template>

<script>
export default {
  data () {
    return {
    	name: '',
    	phone: '',
    	fixarea: '',
    	fixareaData: [],
    	fixmoney: '',
    	fixmoneyData: [],
    	fixtime: '',
    	fixtimeData: []
    }
  },
  methods: {
  	getType () {
  		var that = this
  		that.$axios.request('/Config/Get', {
  			ParamIndex: 4
  		})
  			.then((res) => {
  				if (res.code === 0) {
  					that.fixareaData = res.data.items
  					that.fixarea = that.fixareaData[0].key
  				}
  			})
  		that.$axios.request('/Config/Get', {
  			ParamIndex: 5
  		})
  			.then((res) => {
  				if (res.code === 0) {
  					that.fixtimeData = res.data.items
  					that.fixtime = that.fixtimeData[0].key
  				}
  			})
  		that.$axios.request('/Config/Get', {
  			ParamIndex: 6
  		})
  			.then((res) => {
  				if (res.code === 0) {
  					that.fixmoneyData = res.data.items
  					that.fixmoney = that.fixmoneyData[0].key
  				}
  			})
  	},
  	getData () {
  		var that = this
  		that.$axios.request('/UserInfo/Index')
  			.then((res) => {
  				if (res.code === 0) {
    				that.name = res.data.name
    				that.phone = res.data.phone
  					that.fixarea = res.data.fixArea
  					that.fixtime = res.data.fixTime
  					that.fixmoney = res.data.fixMoney
  				}
  			})
  	},
  	submit () {
  		var that = this
  		that.$axios.request('/UserInfo/UpdateUserInfo', {
  			Name: that.name,
				FixArea: that.fixarea,
				FixTime: that.fixtime,
				FixMoney: that.fixmoney
  		})
  			.then((res) => {
  				if (res.code === 0) {
  					that.$axios.alert('修改成功', '提示', function () {
  						that.getData()
  					})
  				}
  			})
  	}
  },
  mounted () {
  	this.getType()
  	this.getData()
  }
}
</script>